<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>axios学习笔记3</title>
    <script src="axios.js"></script>
</head>
<body>
<script>

  const request = axios.create({
    baseURL: 'http://localhost:8080',
    timeout: 3000,
    // headers: {
    //   'token': 'haha123'
    // }
  })

  // 对象创建后,发送请求前,设置拦截器
  // request与response拦截器都是设置在请求之前

  // interceptors.request 请求拦截器
  request.interceptors.request.use(
    // 传统方式,function函数
    function (config) {
      console.log('请求拦截')
      console.log('config', config)
      // 这是一个方法体,常在这里配置header
      config.headers.token = 'helen123'
      //放行
      return config
    },
    function (error) {
      // 类似于java的静态方法
      return Promise.reject(error)
    }
  )

  // interceptors.response
  request.interceptors.response.use(
    // lambda表达式方式
    response => {
      console.log('response', response)
      // 放行
      // return response
      // 也可以放行 response.data
      return response.data
    },
    error => {
      //对错误做点什么
      return Promise.reject(error)
    })

  request.get('/user/list')
    .then(response => {
      // 如果放行的是  response.data
      // 这里就直接用 response
      // console.log('数据获取成功', response.data)
      console.log('数据获取成功', response)
    })
    .catch(error => {
      console.log('数据获取失败', error)
    })
</script>
</body>
</html>